<template>
	<view class="adverted">
		<cu-custom bgColor="bg-gradual-orange" :isBack="true">
			<block slot="content">收款广告投放</block>
		</cu-custom>
    <view class="cu-form-group margin-top">
    	<textarea @input="textareaAInput" maxlength="500" placeholder="输入或粘贴收款广告" :value="content"></textarea>
    </view>
    
    <view class="padding flex flex-direction">
    	<button class="adverted-btn" :loading="loading" @tap="submit">立即投放</button>
      <button class="adverted-btn" :loading="loading" @tap="clear">清空口令</button>
    </view>
    
    <view class="adverted-tips">
      <view class="tips-title">使用方法:</view>
      <view class="tips-content">一、此功能可实现电商商品口令，或短视频口令，推送给扫码消费用户。</view>
      <view class="tips-content">二、支持抖音、快手、电商商品等口令投放，不支持网址、文字投放。</view>
      <view class="tips-content">三、本产品免费使用，推送成效存在局限，平台不保证推送成效。</view>
      <view class="tips-content">四、禁止投放黄、赌、毒等违法视频、产品、图片信息，一经发现，将严厉打击并移交至公安部门。</view>
    </view>
    
    <view class="adverted-footer"></view>
	</view>
</template>

<script>
  import shop from '@/api/shop';
	export default {
		data() {
			return {
				content: '',
        loading: false
			};
		},
    methods:{
      textareaAInput(e) {
      	if (this.loading) {
      		return;
      	}
      	this.content = e.detail.value
      },
      async submit() {
        if (!this.content) {
          this.toast('收款广告不能为空');
        	return;
        }
      	if (this.loading||!this.content) {
      		return;
      	}
      	this.loading = true;
      	setTimeout(() => {
      		this.loading = false
      	}, 4000)
      	shop.shopWord({word: this.content}).then(res => {
      		this.loading = false;
      		if (res.code === 1) {
      			this.toast('收款广告提交成功');
            setTimeout(()=>{
              uni.navigateBack();
            },1000)
      		}else{
            this.toast(res.msg);
          }
      	})
      },
      // 清空口令
      async clear() {
      	if (this.loading) {
          return;
      	}
      	this.loading = true;
        setTimeout(() => {
          this.loading = false
      	}, 4000)
      	shop.delShopWord({}).then(res => {
          this.loading = false;
      	  if (res.code === 1) {
      	  	this.toast('广告口令清除成功');
      	  }else{
      	    this.toast(res.msg);
      	  }
      	})
      }
    }
	}
</script>

<style lang="less">
  .adverted{
    background: #fff;
    height: 100vh;
    .margin-top{
      margin-left: 15px;
      margin-right: 15px;
      box-shadow: 0 0 15px #FCBB9D inset;
      border-radius: 4px;
      textarea{
        border-radius: 4px;
        min-height: 150px;
      }
    }
    .flex{
      display: flex;
      flex-direction: row;
    }
    .adverted-btn{
      background: url(../../../static/adverted_btn.png) no-repeat center center;
      background-size: cover;
      height: 40px;
      width: 133px;
      outline: none;
      border: none;
      display: inline-block;
      color: #fff;
      line-height: 40px;
      &::after{
        display: none;
      }
    }
    .adverted-clear-btn{
      
    }
    .adverted-footer{
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 0;
      background: url(../../../static/adverted_footer.png) no-repeat center center;
      background-size: cover;
      height: 110px;
    }
    .adverted-tips{
      margin: 0 15px;
      padding: 15px;
      font-size: 14px;
      background: linear-gradient(#FCB99C, #fff);
      position: relative;
      z-index: 1;
      .tips-title{
        font-size: 16px;
        font-weight: 550;
        color: #605E5E;
      }
      .tips-content{
        font-size: 14px;
        line-height: 20px;
        text-indent: 30px;
      }
    }
  }
</style>
